import { Table } from "@/components/table/table";
import { THead } from "@/components/table/thead";
// import { TBody } from "@/components/table/tbody";
import { Tr } from "@/components/table/tr";
import { Td } from "@/components/table/td";
// import { useState } from "react";
// import { useFormatNumber } from "@/utils/hook";
// import { Delete, Advance } from "@/components/svg/svg";
// import { Link } from "react-router-dom";
import "./videoTable.scss";

export const VideoTable = ({}): React.ReactElement => {
  // const [tableData, setTableData] = useState<any[]>([]);

  // const getTableData = async (): Promise<void> => {
  //   let res = await getVideoTableData();
  //   onClick(res);
  //   setTableData(res);
  // };

  // useEffect(() => {
  //   getTableData();
  // }, []);

  // const { formatNumber } = useFormatNumber();

  return (
    <>
      <div className="video_table">
        <Table>
          <THead>
            <Tr>
              <Td align="center">序号</Td>
              <Td align="center">作者</Td>
              <Td align="center">作者主页</Td>
              <Td align="center">视频链接</Td>
              <Td align="center">时长</Td>
              <Td align="center">发布时间</Td>
              <Td align="center">点赞</Td>
              <Td align="center">评论</Td>
              <Td align="center">分享</Td>
              <Td align="center">关键词</Td>
              <Td align="center">操作</Td>
            </Tr>
          </THead>
          {/* <TBody>
            {tableData &&
              tableData.map((item, index) => (
                <Tr key={index}>
                  <Td isShadow align="center">
                    {(index + 1).toString().padStart(2, "0")}
                  </Td>
                  <Td isShadow align="center">
                    {item.uper}
                  </Td>
                  <Td isShadow align="center">
                    {item.myspace}
                  </Td>
                  <Td isShadow align="center">
                    {item.myspace_link}
                  </Td>
                  <Td isShadow align="center">
                    {item.time}
                  </Td>
                  <Td isShadow align="center">
                    {item.create_time}
                  </Td>
                  <Td isShadow align="center">
                    {formatNumber(item.like, 2)}
                  </Td>
                  <Td isShadow align="center">
                    {formatNumber(item.message, 2)}
                  </Td>
                  <Td isShadow align="center">
                    {formatNumber(item.share, 2)}
                  </Td>
                  <Td isShadow align="center">
                    --
                  </Td>
                  <Td isShadow align="center">
                    <div className="dashboard_svg_action_box">
                      <Link to={"/dashboard/video_like"}>
                        <Delete />
                      </Link>
                      <Link to={"/dashboard/video_like"}>
                        <Advance />
                      </Link>
                    </div>
                  </Td>
                </Tr>
              ))}
          </TBody> */}
        </Table>
      </div>
    </>
  );
};
